<#assign resources="${rc.contextPath}/resources">
<#assign path="${rc.contextPath}">
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">

	<title>品牌购首页</title>

   
    <script >
		var path="${path}";
		var searchCondition='${searchCondition}';
	</script>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link href="${resources}/plugins/fontAwesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link href="${resources}/plugins/swiper/swiper-3.3.1.min.css" rel="stylesheet" type="text/css">
    <link href="${resources}/css/common.css" rel="stylesheet" type="text/css">
    <link href="${resources}/css/brandIndex.css" rel="stylesheet" type="text/css">
     <#include "setwxshare.ftl"/>
     <style>
     	.originalPrice{
     		color:#999;
     		text-decoration: line-through;
     	}
     </style>
</head>


<body>

 <div id="container">  
    <!--header-->
    <div class="header">
        <!--logo-->
        <a href="javascript:history.back(-1);" class="fa fa-chevron-left back"></a>
        <!--搜索框-->
        
        <form class="search"  action="${path}/commodity/indexSearch" method="post"  id="searchForm">
            <input id="searchInput" name="searchCondition" type="search" placeholder="请输入商品名称">
         </form>
        <i class="fa fa-search search" aria-hidden="true" onclick="commoditysearch()"></i>
        
        <!--<a href="javascript:void(0)" class="fa fa-map-marker position"></a>-->
    </div>
	<input type="hidden" id="marketId" value="${marketId}">
   
      <!--导航栏-->
    <div class="swiper-nav" id="categorie">
        <ul class="swiper-wrapper nav">
        <input type="hidden" id="categoryId" ></input>
        <#list 	categories as categorie>
		 	<li class="swiper-slide ${(categorie_index==0)?string('active','')}"  id="categorie_${categorie.id}" value="${categorie.id}" >
                <a href="javascript:void(0)" onclick="getGoodsList(${categorie.id})" >${categorie.name}</a>
            </li>
          
		</#list>
           
        </ul>
    </div>
    
<!--
    <div class="address">当前：
        <span class="position">宝安区</span>
        <span class="refresh">
            <i class="fa fa-repeat" aria-hidden="true"></i>
        </span>
    </div>
-->
    <div class="detail">
        <div>
            <ul class="goods" id="goodsShow" >
            	
  
            </li>               
            </ul>
            <div id="tip">上滑加载更多..</div>
        </div>
    </div>

    <!--热搜页-->
    <div class="hotSearch">
        <div class="searchTitle">热门商品</div>
        <ul id="hotsearch" >
        	
        </ul>
    </div>
    <a class="fa fa-shopping-cart shopping-cart" href="${path}/manage/commodityCart/cartShow?marketId=${marketId}" aria-hidden="true"></a>

</div>
<script src="${resources}/plugins/jquery/2.2.2/jquery.min.js"></script>
<script src="${resources}/js/iscroll-probe.js"></script>
<script src="${resources}/plugins/swiper/swiper-3.3.1.jquery.min.js"></script>
<script src="${resources}/js/homeGoods.js"></script>
<script src="${resources}/js/score.js"></script>

<script>
	var mySwiper = new Swiper('.swiper-nav',{
        slidesPerView : 4.5
    });
    //显示热搜
    $("#search").on("focus", function () {
        $(".hotSearch").show();
    });
    
    $("#search").on("click", function (e) {
        e.stopPropagation();
    });

    //隐藏热搜
    $("#container").on("click",function(){
    	$(".hotSearch").hide();
    })
	
	$(function(){
		main.scroll();
		$("#categoryId").val($("#categorie li:first").val());
		getGoodsList($("#categorie li:first").val());
		search();
	
	})
	
	//商品信息展示
	function getGoodsList(categoryId){
		  canLoad=true;
		  $("#loading").hide();
		  $("#tip").show();
		  $("#categoryId").val(categoryId);
		  $("#goodsShow li").remove();
		  //设置属性
		  $("#categorie li").removeClass('active');
		   
		  $("#categorie_"+categoryId).addClass('active');
		  $.ajax({
        		type:"post",
	        	url:"${path}/commodity/indexShow?categoryId="+categoryId+"&marketId=${marketId}",
        		success:function(resultjson){	
	        		
        			if('000' == resultjson.code){
        				var html = "";
        				for (var i = 0; i < resultjson.result.length; i++) {
        					 html += '<li value="'+resultjson.result[i].goods.id+'">';
        					 html += '<a href="${path}/commodity/goodsinfo?goodsId='+resultjson.result[i].goods.id+'&marketId=${marketId}">';
        					 html += '<div class="goods-pic">';
        					 html += '<img src="'+resultjson.result[i].goods.picurl+'"></div>';
        					 html += '<h3>'+resultjson.result[i].goods.name+'</h3>';
        					 html += '<div class="score">';
        					 if(resultjson.result[i].score==0){
							 	html += '<span class="scoreCon" data-score="10"> </span>';
							 }else{
								html += '<span class="scoreCon" data-score="'+resultjson.result[i].score+'"> </span>';
							 }
        					 html += ' </div>';
        					 if(resultjson.result[i].goods.isInventory==1){
        					    html += ' <div class="price">￥'+resultjson.result[i].goods.price+'元 (库存  '+resultjson.result[i].goods.remain+')</div>';
        					 }else{
        					    html += ' <div class="price">￥'+resultjson.result[i].goods.price+'元</div>';
        					 }
        					 html += ' <div class="originalPrice">￥'+resultjson.result[i].goods.originalPrice+'元</div>';
        					 html += ' </a> </li>';
        				}	
        				$("#goodsShow").append(html);
		        		  /* 评分 */
		   				score($(".scoreCon"));

				  		myScroll.refresh();
            			main.max = myScroll.maxScrollY;
            			if(resultjson.result.length==0){
            				$("#tip").text("暂无商品");
        				}else if(resultjson.result.length<20){
            				$("#loading").hide();
			  	            $("#tip").hide();
        				}else if(resultjson.result.length>=20){
 	  		            	$("#loading").hide();
 			  	            $("#tip").show();
 			  	            canLoad=true;
 	  		            }
					
        			}
        		}
        	})
		}

		
		
		//主页面查询
		function commoditysearch(){
			$("#searchForm").submit();
		}
		
		
		//查询热搜词
		function search(){
			$.ajax({
	        		type:"post",
	        		async:false, 
		        	url:"${path}/search/searchShow?marketId=${marketId}",
	        		success:function(resultjson){	
	        			if('000' == resultjson.code){
	        				var html = "";
	        				for (var i = 0; i < resultjson.result.length; i++) {
	        					 html += '<li id="hotSearch_'+resultjson.result[i].id+'" data-val="'+resultjson.result[i].hotsearch+'"><a  href="javascript:void(0)" onclick="hotSearch('+resultjson.result[i].id+')">'+resultjson.result[i].hotsearch+'</a></li>';
	        				}	
	        				$("#hotsearch").append(html);
	        			}
	        		}
	        })
		}
		//热搜词触发事件
		function hotSearch(hotsearch){
		
			$("#search").val($("#hotSearch_"+hotsearch).data("val"));
			//主页面查询
			window.location.href="${path}/commodity/searchHotWords/"+$("#search").val();
		}
		
</script>
</body>			


 

 
